const { createStore } = require('redux')

// 定义reducer函数
// 注意: reducer函数中返回值是什么, 则store对象中的state数据就被覆盖成了什么
// reducer的执行时机:
// 1. 当createStore时,reducer函数会被调用一次. 目的就是为了初始化store的数据
// 2. 调用了store.dispatch(action对象)
function reducer(state = { count: 0, msg: '哈哈哈' }, action) {
  //   console.log('reducer', state, action)
  // state就是redux中的源数据
  // 假设state是一个这样的对象 {count:0,msg: '哈哈哈'}
  // action对象,用来描述需求 {type: 'add'}
  switch (action.type) {
    case 'add':
      return {
        // 写...state是为了保留其他数据
        ...state,
        // count: 0,
        // msg: '哈哈哈'
        // count就是要被修改的数据,:后面是目标值
        count: state.count + 1,
      }
    case 'sub':
      const newCount = state.count - 1
      return {
        ...state,
        count: newCount,
      }
    // 不管有没有case,或有多少个case.都必须要写一个default
    // 写这个default 为了再创建store对象时初始化数据
    default:
      return state
  }
}

const store = createStore(reducer)

// 可以用来监听store数据的变化
store.subscribe(() => {
  // 数据变化,回调执行
  console.log(store.getState())
})
// 查看store中存储的数据
// 注意: 默认情况下,store中的数据是undefined
// console.log(store.getState())
//修改数据
store.dispatch({ type: 'add' })
store.dispatch({ type: 'add' })
store.dispatch({ type: 'sub' })
// console.log(store.getState())
